<?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE html PUBLIC  "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
 <meta name="keywords" content="W3C SVG 1.1 Test Suite testsuite mobile"/>
 <meta name="description" content="W3C SVG 1.1 Test Suite"/>
 <title>
SVG 1.1 test:coords-units-01-b </title>
 <style type="text/css">
 <!--
 body { font-family: "Lucida Grande", verdana, helvetica, sans-serif; line-height: 1.3; text-align: left; margin-top: 0; margin-bottom: 0 }
 .pageTitle { line-height: 1.5; font-weight: bold; margin-bottom: 1em;}
 .pageSubTitle  { color: blue; font-size: 200%; font-weight: bold }
 .openChapter { color: blue; line-height: 1.3; font-weight: bold }
 .openSection { color: blue; line-height: 125%; font-weight: bold }
 .info { color: black; line-height: 1.2; font-size: 90%; }
 p { margin-top:0; margin-bottom:0; padding-top:0; padding-bottom:0 }
 .linkbar { text-align: center; margin: 1em 1em 0.25em 1em;}
 blockquote { margin-top:0; margin-bottom:0; padding-top:0; padding-bottom:0 }
 .opscript {margin-left: 3%; margin-right: 3%; }
 .opscript p { margin-top: 0.7em}
 .navbar {background: black; color: white; font-weight: bold}
 -->
 </style>
 </head>
 <body class="bodytext">

	<div class="linkbar"> 
<p>
<a href="full-coords-units-01-b.html">Full version</a>, <a href="basic-coords-units-01-b.html">Basic version</a></p>
<p>Specification link: <a target="spec" href="http://www.w3.org/TR/SVG11/coords.html#Units">7.10 Units</a></p>
 <p>
				<a href="basic-coords-trans-01-b.html">coords-trans-01-b ←</a> 
				<a href="basic-index.html">index</a>
				<a href="basic-coords-units-02-b.html">→ coords-units-02-b</a>
						</p></div>

	<table align="center" border="0" cellspacing="0" cellpadding="10">
		<tr>
			<td align="center" colspan="3">
				<table border="0" cellpadding="8">
					<tr>
						<td align="center" colspan="2" class="pageTitle">
							<h1>coords-units-01-b</h1>
						</td>
					</tr>
					<tr  class="navbar">
						<td align="center">
							SVG Image
						</td>
						<td align="center">
							PNG Image
						</td>
					</tr>
					<tr>
						<td align="right">
   	    		  			
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
            codebase="" id="mySVGViewerObj" width=160 height=120>
    <param name=movie value="../SvgViewer.swf">
    <param name="FlashVars" value="sourceType=url_svg&svgURL=../svggen/coords-units-01-b.svg">
    <param name="wmode" value="transparent">
    <embed play=false name="mySVGViewerObj" 
	    src="../SvgViewer.swf" quality=high wmode="transparent"
	    width=160 height=120 type="application/x-shockwave-flash"
	    FlashVars="sourceType=url_svg&svgURL=../svggen/coords-units-01-b.svg">
    </embed >
</object>
						</td>
						<td align="left">
							<img alt="raster image of coords-units-01-b" src="../png/basic-coords-units-01-b.png" width="160" height="120"/>
						</td>
					</tr>
				</table>
			</td>
		</tr>
	</table>

               
<div class="opscript">
      <p>
Verify the conversion processing of percentage and fraction values relative to 
object bounding boxes. This is used when defining linear and radial gradients
as well as patterns.
      </p>
      <p>
The test validates conversion for coordinates, width, height and length. The first
test defines three corresponding linear gradients, which specify coordinates 
using percentages for one, fractions for the second and user coordinates for the 
third. The second test defines three corresponding radial gradients, which specify
a length (radius) using percentages for the first, fractions for the second and 
user space for the third. Finally, the third test defines three corresponding patterns,
which specify their width and height using percentages for the first, fractions for the
second and user space coordinates for the last one.
      </p>
      <p>
The rendered image should match the reference image.  Also, the text may
show minor differences, per CSS2 rules for font selection and matching.
      </p>
      <p>
The test also assumes that linear and radial gradients, 
as well as patterns are implemented.
      </p>

		</div>
<div class="linkbar"> <p>
				<a href="basic-coords-trans-01-b.html">coords-trans-01-b ←</a>
				<a href="basic-index.html">index</a>
				<a href="basic-coords-units-02-b.html">→ coords-units-02-b</a>
						</p></div>
</body>
</html>
